<%@ page import="com.wuming.caiwu.security.SecurityHander" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="java.util.Date" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<%
    long currentTime = new Date().getTime();
%>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>上传身份证</title>
    <link rel="stylesheet" href="${allServerPath}static/layui/layui/css/layui.css">
    <link rel="stylesheet" href="${allServerPath}static/layui/css/formSelects-v4.css">
    <link rel="stylesheet" href="${allServerPath}static/css/claimSettlement.css?t=<%=currentTime%>" media="all">
</head>
<body>
<form class="layui-form" action="" id="claimForm">
    <div class="layui-row showTop">
        <fieldset class="layui-elem-field layui-field-title">
            <legend>基本信息</legend>
        </fieldset>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">学员姓名</label>
                <div class="layui-input-inline longer">
                    <input type="text" name="studentName" lay-verify="studentName" autocomplete="off"
                           readonly class="layui-input" value="${student.studentName}">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">学员身份证</label>
                <div class="layui-input-inline longer">
                    <input type="text" name="certNo" lay-verify="certNo" autocomplete="off"
                           value="${student.certNo}" readonly class="layui-input">
                </div>
            </div>
        </div>
    </div>

    <div class="layui-row showTop">
        <fieldset class="layui-elem-field layui-field-title">
            <legend>证件信息</legend>
        </fieldset>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">证件图片</label>
                <div class="layui-upload layui-input-inline imageWidth">
                    <div class="layui-upload-list">
                        <button type="button" class="layui-btn" id="type1"></button>
                        <c:if test="${zhengmian != null}">
                            <img class="layui-upload-img" src="${zhengmian}"
                                 id="type1_img">
                        </c:if>
                        <c:if test="${zhengmian == null}">
                            <img class="layui-upload-img" src="${allServerPath}/static/images/insure/more.png"
                                 id="type1_img">
                        </c:if>
                        <p id="demoText1" class="imageName">学员身份证正面</p>
                    </div>
                </div>
                <div class="layui-upload layui-input-inline imageWidth">
                    <div class="layui-upload-list">
                        <button type="button" class="layui-btn" id="type2"></button>
                        <c:if test="${fanmian != null}">
                            <img class="layui-upload-img" src="${fanmian}"
                                 id="type2_img">
                        </c:if>
                        <c:if test="${fanmian == null}">
                            <img class="layui-upload-img" src="${allServerPath}/static/images/insure/more.png"
                                 id="type2_img">
                        </c:if>
                        <p id="demoText2" class="imageName">学员身份证反面</p>
                    </div>
                </div>
                <div class="layui-upload layui-input-inline imageWidth">
                    <div class="layui-upload-list">
                        <button type="button" class="layui-btn" id="type3"></button>
                        <c:if test="${bank != null}">
                            <img class="layui-upload-img" src="${bank}"
                                 id="type3_img">
                        </c:if>
                        <c:if test="${bank == null}">
                            <img class="layui-upload-img" src="${allServerPath}/static/images/insure/more.png"
                                 id="type3_img">
                        </c:if>
                        <p id="demoText3" class="imageName">银行卡</p>
                    </div>
                </div>
                <canvas id="cv" width="1920" height="969" style="display: none;"></canvas>
            </div>
        </div>
        <input type="hidden" name="studentId" value="${student.id}"/>
        <input type="hidden" name="memberId" value="${student.memberId}"/>
    </div>

    <div class="layui-row showTop">
        <fieldset class="layui-elem-field layui-field-title">
            <legend>收款账户</legend>
        </fieldset>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">账户姓名</label>
                <div class="layui-input-inline longer">
                    <input type="text" name="payeeName" lay-verify="payeeName" autocomplete="off"
                           placeholder="账户名称"
                           class="layui-input" value="${studentFinanceinfo.payeeName}">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">开户银行</label>
                <div class="layui-input-inline moreLonger">
                    <input type="text" name="bankName" lay-verify="bankName" autocomplete="off" placeholder="开户银行"
                           class="layui-input half" value="${studentFinanceinfo.bankName}">
                    <input type="text" name="subbranchName" lay-verify="subbranchName" autocomplete="off"
                           placeholder="支行名称"
                           class="layui-input half" value="${studentFinanceinfo.subbranchName}">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">银行卡号</label>
                <div class="layui-input-inline longer">
                    <input type="text" name="payeeCardno" lay-verify="payeeCardno" autocomplete="off"
                           class="layui-input" value="${studentFinanceinfo.payeeCardno}">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">手机号</label>
                <div class="layui-input-inline longer">
                    <input type="text" name="mobile" lay-verify="mobile" autocomplete="off"
                           class="layui-input" value="${studentFinanceinfo.mobile}">
                </div>
            </div>
            <button class="layui-btn layui-btn-normal" lay-filter="reg" type="button" name="btnSave" id="btnSave"
                    lay-submit=""
                    style="vertical-align: middle">立刻提交
            </button>
        </div>
    </div>
</form>

<script src="${allServerPath}static/layui/layui/layui.js"></script>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="detail">删除</a>
</script>
<script>
    layui.use(['form', 'layedit', 'laydate', 'upload'], function () {
        var form = layui.form
            , layer = layui.layer
            , $ = layui.jquery
            , upload = layui.upload;

        var uploadInst1 = upload.render({
            elem: '#type1'  /*根据绑定id，打开本地图片*/
            , url: '${allServerPath}web/studentimage/save.htmls' /*上传后台接受接口*/
            , auto: true  /*true为选中图片直接提交，false为不提交根据bindAction属性上的id提交*/
            , data: {
                memberId: '<%=SecurityHander.getCurrentUserId()%>',
                studentId: '${student.id}',
                imageType: 1
            }
            , done: function (res) {
                //如果上传失败
                if (res.success) {
                    $('#type1_img').attr('src', res.data); //图片链接（base64）
                }
            }
            , error: function () {
                //演示失败状态，并实现重传
                var demoText1 = $('#demoText1');
                demoText1.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                demoText1.find('.demo-reload').on('click', function () {
                    uploadInst1.upload();
                });
            }
        });

        var uploadInst3 = upload.render({
            elem: '#type3'  /*根据绑定id，打开本地图片*/
            , url: '${allServerPath}web/studentimage/save.htmls' /*上传后台接受接口*/
            , auto: true  /*true为选中图片直接提交，false为不提交根据bindAction属性上的id提交*/
            , data: {
                memberId: '<%=SecurityHander.getCurrentUserId()%>',
                studentId: '${student.id}',
                imageType: 8
            }
            , done: function (res) {
                //如果上传失败
                if (res.success) {
                    $('#type3_img').attr('src', res.data); //图片链接（base64）
                }
            }
            , error: function () {
                //演示失败状态，并实现重传
                var demoText3 = $('#demoText3');
                demoText3.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                demoText3.find('.demo-reload').on('click', function () {
                    uploadInst3.upload();
                });
            }
        });

        var uploadInst2 = upload.render({
            elem: '#type2'  /*根据绑定id，打开本地图片*/
            , url: '${allServerPath}web/studentimage/save.htmls' /*上传后台接受接口*/
            , auto: true  /*true为选中图片直接提交，false为不提交根据bindAction属性上的id提交*/
            , data: {
                memberId: '<%=SecurityHander.getCurrentUserId()%>',
                studentId: '${student.id}',
                imageType: 2
            }
            , done: function (res) {
                //如果上传失败
                if (res.success) {
                    $('#type2_img').attr('src', res.data); //图片链接（base64）
                }
            }
            , error: function () {
                //演示失败状态，并实现重传
                var demoText2 = $('#demoText2');
                demoText2.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                demoText2.find('.demo-reload').on('click', function () {
                    uploadInst2.upload();
                });
            }
        });

        form.on('submit(reg)', function (data) {
            var payeeName = $("input[name='payeeName']").val();
            var bankName = $("input[name='bankName']").val();
            var subbranchName = $("input[name='subbranchName']").val();
            var mobile = $("input[name='mobile']").val();
            var payeeCardno = $("input[name='payeeCardno']").val();
            var studentId = '${student.id}';
            $.ajax({
                type: "post",
                url: "${allServerPath}web/studentfinanceinfo/save.htmls",
                dataType: 'JSON',
                data: {
                    "id":'${studentFinanceinfo.id}',
                    "memberId": "<%=SecurityHander.getCurrentUserId()%>",
                    "payeeName":payeeName,
                    "bankName":bankName,
                    "subbranchName":subbranchName,
                    "mobile":mobile,
                    "payeeCardno":payeeCardno,
                    "studentId":studentId
                },
                error: function (request) {
                    layer.alert('操作失败', {
                        icon: 2,
                        title: "提示"
                    });
                },
                success: function (ret) {
                    console.log(ret);
                    if (ret.success) {
                        layer.msg("保存开户信息成功.");
                        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                        parent.layer.close(index); //再执行关闭
                    } else {
                        layer.alert(ret.msg, {
                            icon: 2,
                            title: "提示"
                        });
                    }
                }
            })
        });
    })

    SHENGWANG_CONFIG = {
        "https://hn.122.gov.cn": 24300,
        "https://ah.122.gov.cn": 23203
    }
</script>
</body>
</html>
